<style>
  .admin-meassage-drawer-footer{
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    border-top: 1px solid #e8e8e8;
    padding: 10px 16px;
    text-align: right;
    background: #fff;
  }
</style>
<template>
  <div>
    <Drawer
      :value="modalState"
      :closable="false"
      :title="title"
      @on-close="cancel"
      width="35%">
      <div style="margin-top: 50px;">
        <div>
          <div style="font-size: 16px; display: inline-block; width: 100px; text-align: right">标题：</div>
          <div style="font-size: 14px; display: inline-block; margin-left: 30px;">{{row.title}}</div>
        </div>
        <div style="margin-top: 60px;">
          <div style="font-size: 16px; float: left; width: 100px; text-align: right">广告图片：</div>
          <div style="float: left; margin-left: 30px;">
            <img :src="row.img" style="width: 300px; height: 200px;">
          </div>
        </div>
      </div>
      <div class="admin-meassage-drawer-footer">
        <Button style="margin-right: 8px" @click="cancel">返回</Button>
      </div>
    </Drawer>
  </div>
</template>
<script>
import {
  mapActions,
  mapState
} from 'vuex'
export default {
  name: 'ViewAdDrawer',
  props: {
    modalState: Boolean,
    row: null
  },
  data () {
    return {
      title: '',
      loading: true
    }
  },
  computed: {
  },
  methods: {
    changeLoading () {
      this.loading = false
      this.$nextTick(() => {
        this.loading = true
      })
    },
    cancel () {
      this.$emit('on-cancel', this.$refs['viewAdDrawer'])
    }
  }
}
</script>
